import styles from './styles.module.less'
import { SettingMenuPropsType } from './types'
const SettingItem = (porps: SettingMenuPropsType) => {
  const {
    title,
    description,
    actions,
  } = porps
  return (
    <div className={styles.SettingItem}>
      <div className='flex justify-between items-center'>
        <div className='font-bold'>
          {title}
        </div>
        <div className='flex gap-2'>
          {actions?.map((e, index) => {
            return (
              <div key={index}>
                {e}
              </div>
            )
          })}
        </div>
      </div>
      <div className={styles.description}>
        {description}
      </div>
    </div>
  )
}
export default SettingItem